<template>
<el-page-header @click="goback">
    <template #content>
      <span class="text-large font-600 mr-3">计件项目重审</span>
    </template>
  </el-page-header>
  <el-descriptions
    class="margin-top"
    style="
      border-radius: 10px;
      margin: 20px auto;
      width: 73%;
      box-shadow: 5px 5px 10px rgba(98, 106, 239, 0.5);
    "
    :column="2"
    size="large"
    border
  >
    <el-descriptions-item label-class-name="my-label" class-name="my-content">
      <template #label>
        <div class="cell-item">
          <el-icon :style="iconStyle">
            <iphone />
          </el-icon>
          所属部门
        </div>
      </template>
      {{ deptName }}
    </el-descriptions-item>
    <el-descriptions-item label-class-name="my-label" class-name="my-content">
      <template #label>
        <div class="cell-item">
          <el-icon :style="iconStyle">
            <tickets />
          </el-icon>
          岗位
        </div>
      </template>
      {{ position }}
    </el-descriptions-item>
	
  </el-descriptions>
  
  
  <div v-for="(item,index) in tableData">
	  <br>
	  <div style="margin: auto 150px;">({{index+1}})被考核人:{{item[0].empName}}</div>
  
    <el-table
      :data="item"
      border
      style="width: 80%; margin: 20px auto;border-radius: 8px;box-shadow: 5px 5px 10px rgba(64, 158, 255, 0.5);"
      :header-cell-style="{
          'background': '#337ecc !important',
          'color': '#ffffff',
          'border': 'none !important'
        }">
      <el-table-column prop="empName" label="被考核人" width="200"/>
      <el-table-column prop="name" label="条目" width="200" />  
      <el-table-column prop="targetNum" label="单价/￥"  width="200" />
      <el-table-column prop="workOrder" label="数量" />
      <el-table-column prop="quality" label="质量/%" width="200" />
	  <el-table-column prop="difficulty" label="难度系数/%" />
		<el-table-column prop="total" label="总计" width="200" />
    </el-table>
    	<div style="text-align: right;margin-right: 200px;margin-bottom: 20px;"> 总计：{{totalList[index]}}</div>
	
	</div>
	
	
    <el-button type="primary" @click="submitForm" class="button" >重审通过</el-button>
</template>

<script setup>
import {ref, onBeforeMount, reactive,getCurrentInstance} from "vue";
import { useRoute } from 'vue-router'
import {getSecondBack} from "@/api/empPiece"
import {backAddPiece} from "@/api/resultSecond"
import { ElMessage } from 'element-plus'

const route = useRoute();
let deptName = route.query.deptName
let position = route.query.position;
var totalList = [];
const tableData=ref([])
onBeforeMount(()=>{
let positionId = route.query.id;
  getSecondBack({positionId}).then((data) => {
    
	var long = data.data
	long.sort()
	var flag = 1
	const tableDataCopy = []
	var datax = [];
	
	for(let i = 0 ; i<long.length;i++){
		
		datax.push(long[i])
		
		
		if(i+1<long.length && long[i].empName != long[i+1].empName){
			tableDataCopy.push(datax)
			datax = []
			flag++;
		}
		
	}
	
	tableDataCopy.push(datax)
	
	var totalx = 0
	// var totalList = [];
	for(let i=0 ; i < tableDataCopy.length ; i++ ){
		
		for(let y = 0 ; y<tableDataCopy[i].length;y++){
			// tableDataCopy[i][y].total = 1561
			// console.log(tableDataCopy[i][y].total)
			tableDataCopy[i][y].total = parseFloat((tableDataCopy[i][y].workOrder*tableDataCopy[i][y].targetNum*tableDataCopy[i][y].quality*tableDataCopy[i][y].difficulty/10000).toFixed(2))
			totalx += parseFloat(tableDataCopy[i][y].total)
		}
		totalList[i] = totalx.toFixed(2)
		totalx = 0
	}
	
	
	tableData.value = tableDataCopy
	
	
  });
})

const { proxy } = getCurrentInstance();
const goback=()=>{
  proxy.$router.go(-1)
}

const submitForm = () => {
  let assessorId = JSON.parse(localStorage.getItem("userInfo")).id;
let positionId = route.query.id;
  let positionType=route.query.type
  backAddPiece({assessorId, positionId, positionType })
  .then((data) => {
      if (data.code == 200) {
        ElMessage({
          message: "提交成功",
          type: "success",
        });
        goback()
      } else {
        ElMessage.error("提交失败");
      }
    }
  );
};
</script>
<style  scoped>
.button {
  width: 120px;
  height: 40px;
  margin: 10px 130px;
  float: right;
}
.el-card {
  border-radius: 10px;
  margin: 20px auto;
}
:deep(.my-label) {
  background: rgba(98, 106, 239, 0.15) !important;
  color: #626aef !important;
  border: #626aef 2px solid !important ;
}
:deep(.my-content) {
  color: #fff !important;
  background: rgba(98, 106, 239, 0.9) !important;
  border: #626aef 2px solid !important ;
}
.button{
        width: 120px;
        height: 40px;
        margin: 10px 130px;
        float: right;
    }
</style>
